<template><div>
                <header class="content__title">
                    <h1>FLOT</h1>
                    <small>Flot is a pure JavaScript plotting library for jQuery, with a focus on simple usage, attractive looks and interactive features.</small>

                    <div class="actions">
                            <a href="" class="actions__item zmdi zmdi-trending-up"></a>
                            <a href="" class="actions__item zmdi zmdi-check-all"></a>

                            <div class="dropdown actions__item">
                                <i data-toggle="dropdown" class="zmdi zmdi-more-vert"></i>
                                <div class="dropdown-menu dropdown-menu-right">
                                    <a href="" class="dropdown-item">Refresh</a>
                                    <a href="" class="dropdown-item">Manage Widgets</a>
                                    <a href="" class="dropdown-item">Settings</a>
                                </div>
                            </div>
                        </div>
                </header>

                <div class="row">
                    <div class="col-md-6">
                        <div class="card">
                            <div class="card-header">
                                <h2 class="card-title">Line Chart</h2>
                            </div>

                            <div class="card-block">
                                <div class="flot-chart flot-line"></div>
                                <div class="flot-chart-legends flot-chart-legends--line"></div>
                            </div>
                        </div>

                        <div class="card">
                            <div class="card-header">
                                <h2 class="card-title">Line Chart with curved edges</h2>
                                <small class="card-subtitle">Curved edges made possible with the help of curvedLines Flot plugin.</small>
                            </div>

                            <div class="card-block">
                                <div class="flot-chart flot-curved-line"></div>
                                <div class="flot-chart-legends flot-chart-legends--curved"></div>
                            </div>
                        </div>

                        <div class="card">
                            <div class="card-header">
                                <h2 class="card-title">Pie Chart</h2>
                            </div>

                            <div class="card-block">
                                <div class="flot-chart flot-pie"></div>
                                <div class="flot-chart-legends flot-chart-legend--pie"></div>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-6">
                        <div class="card">
                            <div class="card-header">
                                <h2 class="card-title">Bar Chart</h2>
                            </div>

                            <div class="card-block">
                                <div class="flot-chart flot-bar"></div>
                                <div class="flot-chart-legends flot-chart-legends--bar"></div>
                            </div>
                        </div>

                        <div class="card">
                            <div class="card-header">
                                <h2 class="card-title">Dynamic Data Chart</h2>
                            </div>

                            <div class="card-block">
                                <div class="flot-chart flot-dynamic"></div>
                                <div class="flot-chart-legends flot-chart-legends--dynamic"></div>
                            </div>
                        </div>

                        <div class="card">
                            <div class="card-header">
                                <h2 class="card-title">Donut Chart</h2>
                            </div>

                            <div class="card-block">
                                <div class="flot-chart flot-donut"></div>
                                <div class="flot-chart-legends flot-chart-legend--donut"></div>
                            </div>
                        </div>
                    </div>
                </div>

                
            </div></template>